<%@page import="servlets.BrowserCache"%>
<%@page import="data.SignedRequest"%>
<%@page import="faceBook.User"%>
<% 
if(BrowserCache.handleCache(request, response, 3600/*1 hour*/, "index.jsp"))
	return;
//This adds the user to a queue
//so that they are added to the database in the background
User user = null;
if(request.getParameter("signed_request") != null)
{
  user = SignedRequest.buildUserInfo(request.getParameter("signed_request")); 
}
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<%@ page import="foxtrotbravo.*" %>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:og="http://ogp.me/ns#"
      xmlns:fb="https://www.facebook.com/2008/fbml">
  <head>
  	<%@ include file="head.jsp" %>
  	
    <title>Plan and Post</title>
    
  	<link rel='stylesheet' type='text/css' href='/css?files=calendar/fullcalendar.css,calendar/fullcalendar.print.css,jquery.facebook.multifriend.select.css,index.css' />
  	
  	<script type="text/javascript" src="/js?files=fb.js,calendar/fullcalendar.js,date-events.js,jquery.facebook.multifriend.select.js,options.js,infoWindow.js,fbCredits.js"></script>
  	
  </head>

  <body id="foxtrotBody">
<%@ include file="fb.jsp" %>
  <div class="headerContainer clearfix">
  <img class="lfloat" src="/img/logo-75.png" alt="logo icon" />
	<h1 class="pageTitle">Plan and Post <span>Beta</span></h1>
	<p class="pageDescription">Create and schedule posts, thoughtful notes, birthday wishes and more. Then we'll post them for you on any date you choose. It's that simple.</p>
  </div>
  
  <% if(user != null){ %>
  
  <div class="rfloat" id="customMessageCount">
    <div class="rfloat" id="messageBuy">Custom Messages Left: <span id="currentMessageCount"><%= user.getCustomMessageCount() %></span></div>
    <span class="infoWindowClick" id="messageHelpinfo">
	    <button id="messageHelpBtn" aria-disabled="false" role="button" class="ui-widget ui-state-default ui-corner-all">  
	      <span class="ui-icon"></span>  
	    </button>
    </span>    
  </div>
  
  <div id="searchBar">
	<button class="button ui-button ui-widget ui-state-default ui-corner-all rfloat optionsBtn" style="margin-right:0px;" role="button" aria-disabled="false">
		<span class="ui-icon ui-icon-gear""></span>
		<span class="ui-button-text">Options</span>
	</button>				
  </div>
  <% } %>
  
  <button id="request" class="rfloat button rightButton ui-button ui-widget ui-state-default ui-corner-all" role="button" aria-disabled="false">
		<span class="ui-icon ui-icon-person"></span>
		<span class="ui-button-text">Invite Friends</span>
	</button>
	
	
  <div id="authorize" class="hide rfloat">
    This app will not<BR>
    work properly without<BR>
    authorization.<BR>
    <button aria-disabled="false" role="button" class="button createMessageButton ui-button ui-widget ui-state-default ui-corner-all">  
      <span class="ui-icon ui-icon-plusthick"></span>  
      <span class="ui-button-text">Authorize App</span>
    </button>
  </div>  
  
  <div style="display:inline;">
  	<fb:like href="http://apps.facebook.com/planandpost/" send="true" width="90" show_faces="false" />
  </div>
  
  <div class="wrapper">
	
	<div id='calendar'></div>
	
  </div>
	<div id="msgtabs" class="hide">
		<div id="tabs">
			<ul>
				<li><a href="#birthdayTab">Birthday Wish</a></li>
				<li><a href="#holidayTab">Holiday Wish</a></li>
				<li><a href="#specialTab">Special Notes, etc</a></li>
			</ul>
			<div id="birthdayTab"></div>
			<div id="holidayTab"></div>
			<div id="specialTab"></div>
		</div>
	</div>
	<div id="fbfs"  class="hide">
	<div id="findFriends"></div>
	</div>
  <% if(user != null){ %>
	<div id="settings"  class="hide">
	  <div id="birthdayResponder" class="settingBlock">
		<h2 class="settingsTitle">Birthday Responder</h2>
		<input <%= user.getUseReply()?"checked='checked'":"" %> type="radio" name="useReply" value="true" />On
		<input <%= user.getUseReply()?"":"checked='checked'" %> type="radio" name="useReply" value="false" />Off
		<BR><BR>
		<p>With this option on, anyone who wishes you a "happy birthday"<br>will receive this message back.</p>
		<textarea name="replyMessage"><%= (user.getReplyMessage() != null)?user.getReplyMessage():"Thanks for the happy birthday!" %></textarea><BR>
	  </div>
	  <div id="defaultBd" class="settingBlock">
		<h2 class="settingsTitle">Default Birthday Message</h2>
		<input <%= user.getUseDefaultBD()?"checked='checked'":"" %> type="radio" name="useDefaultBD" value="true" />On
		<input <%= user.getUseDefaultBD()?"":"checked='checked'" %> type="radio" name="useDefaultBD" value="false" />Off
		<BR><BR>
		<p>With this option on, all of your friends will receive this message<br>on their birthday unless you have specified a custom message for them.<BR><span class="infoWindow" id="replacements">Learn more</span></p><BR>
		<label>Default message for guys</label><BR>
		<textarea name="defaultBDMessageMale"><%= (user.getDefaultBDMessageMale() != null)?user.getDefaultBDMessageMale():"Happy Birthday!" %></textarea><BR><BR>
		<label>Default message for girls</label><BR>
		<textarea name="defaultBDMessageFemale"><%= (user.getDefaultBDMessageFemale() != null)?user.getDefaultBDMessageFemale():"Happy Birthday!" %></textarea><BR>
		<label>Same message for guys and girls</label>
		<input type="checkbox" id="equalGenders" /><BR><BR>
	  </div>
    <button id="saveSettings" aria-disabled="false" role="button" class="button ui-button ui-widget ui-state-default ui-corner-all">  
      <span class="ui-icon ui-icon-disk"></span>  
      <span class="ui-button-text">Save</span>
    </button>
	</div>
	<div id="infoWindow-replacements" class="infoWindowPopup">
	  <h2 class="settingsTitle">Replacements</h2>
	  	<button aria-disabled="false" role="button" class="closeButton button ui-widget ui-state-default ui-corner-all">  
	      <span class="ui-icon ui-icon-close"></span>
		</button>
	  <BR><BR>
	  You can use you friend's first name and last name is default text using "*FIRST_NAME*" and "*LAST_NAME*".<BR><BR> "Happy Birthday *FIRST_NAME*, *LAST_NAME*!" <BR> "Happy Birthday John Smith!".
	</div>
	<div id="infoWindow-messageHelpinfo" class="infoWindowPopup">
		<h2 class="settingsTitle">Custom Messages</h2>
	  	<button aria-disabled="false" role="button" class="closeButton button ui-widget ui-state-default ui-corner-all">  
	      <span class="ui-icon ui-icon-close"></span>
    	</button>
	  <BR><BR>
	  Custom messages are used to send a special message to a particular friend.
	  This can be for a holiday or any special occasion like an anniversary.
	  <BR><BR>
	  You are allowed 2 free custom messages and an additional three after you like this page.
	  You can <a class="buyMessages" messageCount="100">buy 100 more</a> for only a dollar(10 credits) or <a class="buyMessages" messageCount="600">600 for $5(50 credits)</a>.
	</div>
	<div id="messageBuyDialog" class="hide">
	<h2 class="settingsTitle">Buy Messages</h2>
    <BR><BR><BR><BR>
    <div class="buyItem">
	    <div class="lfloat">100 Messages</div>
	    <div class="rfloat">
		    <button messageCount="100" class="buyButton buyMessages button ui-button ui-widget ui-state-default ui-corner-all rfloat" style="margin-right:0px;" role="button" aria-disabled="false">
				<span class="ui-icon ui-icon-gear""></span>
				<span class="ui-button-text">Buy Now $1</span>
			</button>
		</div>
		<br clear="all">
    </div>
    <div class="buyItem">
	    <div class="lfloat">600 Messages</div>
	    <div class="rfloat">
		    <button messageCount="600" class="buyButton buyMessages button ui-button ui-widget ui-state-default ui-corner-all rfloat" style="margin-right:0px;" role="button" aria-disabled="false">
				<span class="ui-icon ui-icon-gear""></span>
				<span class="ui-button-text">Buy Now $5</span>
			</button>
		</div>
		<br clear="all">
    </div>
	</div>
  <% } %>
	<span class='hide' id="holidayData"><%= Holiday.getAllAsJson()%></span>
  </body> 
</html>
